/* eslint-disable no-unused-vars */
/* eslint-disable semi */
import { useEffect } from 'react'
import { useDispatch } from 'react-redux'
import { Card, CardBody, CardHeader, CardTitle } from 'reactstrap'
import FloatingBtn from '../../components/addAppointment/FloatingBtn'
import ChatBox from '../../components/message/ChatBox'
import { getMyProviderAction } from '../../redux/myProvider/myProviderAction'
import { getMyProfileAction } from '../../redux/profile/profileAction'
const Messages = () => {
  const dispatch = useDispatch()

  useEffect(() => {
    dispatch(getMyProviderAction())
    dispatch(getMyProfileAction())
  }, [])
  return (
    <div>
      <Card className="padding-left margin-bottom-0 px-0">
        <CardHeader className="bgyellowish">
          <CardTitle className="black fw-800">Messages</CardTitle>
          <CardTitle className="d-sm-none d-lg-block d-md-block">
            {/* <Button
              size="sm"
              className="AppointmentBtn reqbgColor request-btn "
            >
              Request Appointment
            </Button> */}
          </CardTitle>
        </CardHeader>
        <CardBody className="card-body-styling messages-card-body">
          <ChatBox />
          <FloatingBtn />
        </CardBody>
      </Card>
    </div>
  )
}

export default Messages
